<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>BIG DEAL</title>
		<link href="styles.css" rel="stylesheet" type="text/css">
        <link rel="shortcut icon" href="../favicon.ico"> 
		<link rel="stylesheet" type="text/css" href="css/style.css" />
		<script src="js/modernizr.custom.63321.js"></script>
		<script src="js/jquery.js"></script>
	</head>
	<body>
	<%String temp =(String)session.getAttribute("query"); %>
	<a class="giohang" style="font-family:arial;" id="giohang" href = "ShoppingCart.jsp?cartAction=update">Giỏ Hàng</a>
	<jsp:useBean id="model1" scope = "session" class = "controler.advanceSearch"/>
	<%model1.doGet(request, response);%>
	<a href="#" class="tknc-button" id="tkncid"><div style="font-family:arial;">Tìm Kiếm Nâng Cao</div></a>
	<div class="overlay"></div>
	<form class="tknc" id="login1" method = "post" action="search" name = "Search">
	<div class="login-header">
			<span>Tìm Kiếm Nâng Cao</span>
			<a href="#" class="close">x</a>
	</div>
	<div class="login-content">
	<label for="thensanpham">Tên sản phẩm :</label>
	<input type ="text" name ="name" >
	<label for="danhmuc">Danh mục : </label>
	<select name = "MADANHMUC" >
	${optionlist}
	</select>
	<label for="thuonghieu">Thương hiệu :</label>
	<select name = "thuonghieu" >
	${thoptionlist}
	</select>
	<label for="giacaohon">Giá thấp hơn :</label>
	<input type = "text" name = "pricemax" >
	<label for="thensanpham">Giá cao hơn :</label>
	<input type = "text" name = "pricemin" >
	<div class="tim"> <input type = "submit" value = "Search"/></div>
	</div>
	</form>
	<script>

	(function($){

	var overlay = $('.overlay');
	var login = $('.tknc');
	var body = $('body');
	$('.tknc-button').click(function(e){
		e.preventDefault();
		body.css({'overflow':'hidden'});
		overlay.fadeIn(500,function(){
			login.fadeIn(500);
		})
	});

	$('.close').click(function(e){
		e.preventDefault();
		login.fadeOut(500,function(){
			overlay.fadeOut(500);
			body.css({'overflow':'visible'});
		})
	})
	})(jQuery);

	</script>
	<div class="login-bar">
		<a href="#" class="login-button">Login</a>
	</div>
	<div class="overlay"></div>
	<form class="login" action="login" method = "POST">
		<div class="login-header">
			<span>Vui Lòng Đăng Nhập</span>
			<a href="#" class="close">x</a>
		</div>
		<div class="login-content">
			<label for="name">Name:</label>
			<input type="text" name="userName" value = "" required>
			<label for="pass">Pass:</label>
			<input type="password" name="passWord" value = "" required>
			<div class="nhaptim"><input type="submit" value="Login" name="action" class="loginsubmit"/></div>
		</div>
	</form>
	<script>

	(function($){

	var overlay = $('.overlay');
	var login = $('.login');
	var body = $('body');
	$('.login-button').click(function(e){
		e.preventDefault();
		body.css({'overflow':'hidden'});
		overlay.fadeIn(500,function(){
			login.fadeIn(500);
		})
	});

	$('.close').click(function(e){
		e.preventDefault();
		login.fadeOut(500,function(){
			overlay.fadeOut(500);
			body.css({'overflow':'visible'});
		})
	})
	})(jQuery);

	</script>
	<div class="danhmuc">
	Danh mục : 
	<table>
	<c:forEach items="${list}" var="list" >
	<tr>
	<td><div class="tendanhmuc"><a href ="search?MADANHMUC=${list.madanhmuc}">${list.tendanhmuc}</a></div></td>
	</tr>
	</c:forEach>
	</table>
	</div>
	<div class="chucnangtimkiem">
	<form method = "post" action="search">
    <div class="chondm">
    <select name = "MADANHMUC">
			${optionlist}
	</select>
	</div>
	<div id="search"> 
	<input type = "text" placeholder="Search..." name = "name" >
	</div>
	<div class="nuttimkiem">
	<input name="antim" type = "submit" value = "Search">
	</div> 
	</form>
	</div>
	<div class="khuyenmai">
	<table>
	<c:forEach items="${listkm}" var="listkm" >
	<tr>
	<td><h1 class="tenkhuyenmai" style="font-family:commic san;font-size: 25px;">Khuyến mãi:</h1></td>
	</tr>
	<tr>
	<td><MARQUEE><strong style="font-family:arial;font-size: 20px;">${listkm.noidungkm}</strong></MARQUEE></td>
	</tr>
	</c:forEach>
	</table>
	<jsp:useBean id="common" scope = "application" class = "dao.common"/>
	<jsp:useBean id="loginmodel" scope = "application" class = "model.LoginModel"/>
	</div>
		<div style="clear:both;"></div>
        <div class="container">	
			<div class="codrops-top clearfix">
				<a href="#TRANGCH_2"><strong>&laquo; HOTLINE: </strong>0988849124-0902767830</a>
				<span class="right"><a>
				<%session = request.getSession(); 	
		    	if(common.checkquyen(session)== true){ %>
		    	<a href = "admindanhmuc">Admin</a>
		    	<%
		    	}
		    	%>	
				<% session = request.getSession(); 	
			    if(common.userinlogin(session)== true){		    		
			    	if(loginmodel.s ==1){
			    %>
				<strong>Welcome,<a href ="userDetail.jsp?makh=${sessionScope.userName}">${sessionScope.userName}</a></strong>
				<%} %>
				<a href ="logout" style="font-family:arial;">Đăng xuất</a>
				<%
				}
				%></a><a href="#ANGK_0"><strong style="font-family:arial;">Đăng Kí</strong></a>
				</span>
				</div>
				<header class="clearfix">
				<h1><a href="trangchu">BIG DEAL</a> <span>Giá Sóc Tận Óc</span></h1>
			</header>
			<div class="main">
				<div id="mi-slider" class="mi-slider">
					<ul>
						<li><a href="ctsanpham.jsp?masp=${listthoitrang.get(0).getMasp()}"><img src="${listthoitrang.get(0).getUrlhinh() }" alt="img01"><h4>1</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listthoitrang.get(1).getMasp()}"><img src="${listthoitrang.get(1).getUrlhinh() }" alt="img02"><h4>2</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listthoitrang.get(2).getMasp()}"><img src="${listthoitrang.get(2).getUrlhinh() }" alt="img03"><h4>3</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listthoitrang.get(3).getMasp()}"><img src="${listthoitrang.get(3).getUrlhinh() }" alt="img04"><h4>4</h4></a></li>
					</ul>
					<ul>
						<li><a href="ctsanpham.jsp?masp=${listdientu.get(0).getMasp()}"><img src="${listdientu.get(0).getUrlhinh() }" alt="img01"><h4>1</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listdientu.get(1).getMasp()}"><img src="${listdientu.get(1).getUrlhinh() }" alt="img02"><h4>2</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listdientu.get(2).getMasp()}"><img src="${listdientu.get(2).getUrlhinh() }" alt="img03"><h4>3</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listdientu.get(3).getMasp()}"><img src="${listdientu.get(3).getUrlhinh() }" alt="img04"><h4>4</h4></a></li>
					</ul>
					<ul>
						<li><a href="ctsanpham.jsp?masp=${listanuong.get(0).getMasp()}"><img src="${listanuong.get(0).getUrlhinh() }" alt="img01"><h4>1</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listanuong.get(1).getMasp()}"><img src="${listanuong.get(1).getUrlhinh() }" alt="img02"><h4>2</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listanuong.get(2).getMasp()}"><img src="${listanuong.get(2).getUrlhinh() }" alt="img03"><h4>3</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listanuong.get(3).getMasp()}"><img src="${listanuong.get(3).getUrlhinh() }" alt="img04"><h4>4</h4></a></li>
					</ul>
					<ul>
						<li><a href="ctsanpham.jsp?masp=${listdulich.get(0).getMasp()}"><img src="${listdulich.get(0).getUrlhinh() }" alt="img01"><h4>1</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listdulich.get(1).getMasp()}"><img src="${listdulich.get(1).getUrlhinh() }" alt="img02"><h4>2</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listdulich.get(2).getMasp()}"><img src="${listdulich.get(2).getUrlhinh() }" alt="img03"><h4>3</h4></a></li>
						<li><a href="ctsanpham.jsp?masp=${listdulich.get(3).getMasp()}"><img src="${listdulich.get(3).getUrlhinh() }" alt="img04"><h4>4</h4></a></li>
					</ul>
					<nav>
						<a href="#">Thời Trang</a>
						<a href="#">Điện Tử</a>
						<a href="#">Ăn Uống</a>
						<a href="#">Du Lịch</a>
					</nav>
				</div>
			</div>
		</div><!-- /container -->
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
		<script src="js/jquery.catslider.js"></script>
		<script>
		    $(function () {

		        $('#mi-slider').catslider();

		    });
		</script>
</body>
</html>